/**
 * The map of the application. Its contents will be changed dynamically
 */
var map;

/**
 * The list of markers of the map. Will be change every time the map is shown
 */
var markers = [];

/**
 * Initializes the map only once.
 */
function initMap() {
	if (!map) {
		map = new L.Map("map");
		var tiles = new L.TileLayer(
				"http://{s}.tile.cloudmade.com/6fa1263432d245b6a7f8b772fcbafe8a/997/256/{z}/{x}/{y}.png");
		map.addLayer(tiles);
		showFacilitiesInMap();
	}
}

/**
 * The marker icon for a Ship
 */
var shipMarker;

/**
 * Create the icon marker for a Ship
 */
function getShipMarker() {
	if (!shipMarker) {
		shipMarker = new L.Icon({
			iconUrl : 'images/ship_marker.png',
			iconRetinaUrl : 'images/ship_marker@2x.png',
			iconSize : new L.Point(32, 32),
			iconAnchor : new L.Point(16, 32),
			popupAnchor : new L.Point(1, -34),
			shadowSize : new L.Point(41, 41)
		});
	}

	return shipMarker;
}

/**
 * The marker icon for a Facility
 */
var facilityMarker;

/**
 * Create the icon marker for a Facility
 */
function getFacilityMarker() {
	if (!facilityMarker) {
		facilityMarker = new L.Icon({
			iconUrl : 'images/ic_number_2.png',
			iconRetinaUrl : 'images/ic_number_2.png',
			iconSize : new L.Point(32, 32),
			iconAnchor : new L.Point(16, 32),
			popupAnchor : new L.Point(1, -34),
			shadowSize : new L.Point(41, 41)
		});
	}

	return facilityMarker;
}

var imageMarkers = [ 'images/ic_number_0.png', 'images/ic_number_1.png',
		'images/ic_number_2.png', 'images/ic_number_3.png',
		'images/ic_number_4.png', 'images/ic_number_5.png',
		'images/ic_number_6.png', 'images/ic_number_7.png',
		'images/ic_number_8.png', 'images/ic_number_9.png' ];

var markersArray;

function getMarkers() {
	if (!markersArray) {
		markersArray = [];
		for ( var i = 0; i < 10; i++) {
			markersArray[i] = new L.Icon({
				iconUrl : imageMarkers[i],
				iconRetinaUrl : imageMarkers[i],
				iconSize : new L.Point(32, 32),
				iconAnchor : new L.Point(16, 32),
				popupAnchor : new L.Point(1, -34),
				shadowSize : new L.Point(41, 41)
			});
		}
	}
	return markersArray;
}

/**
 * Create the list of markers for the given list of points using the given
 * marker icon. Also sets a popup with the given content. Position i of the
 * popups will be used for the position i of the points
 */
function addMarkers(points, popups) {
	for ( var i = 0; i < points.length; i++) {
		var mark = new L.Marker(points[i], {
			icon : markers[i]
		});
		//markers[markers.length] = mark;
		map.addLayer(mark);
		mark.bindPopup(popups[i]);
		// mark.openPopup();

		// var circle = L.circle(points[i], 10);
		// map.addLayer(circle);
	}
}

/**
 * Remove all the markers from the map
 */
function removeMarkers() {
	for ( var i = 0; i < markers.length; i++) {
		map.removeLayer(markers[i]);
	}
}

/**
 * Set the view to the map, centered using the given points. The zoom will be
 * the maximum to see all the points
 */
function setViewOfMap(points) {
	// if no points, use the bounds of the port
	if (points == null || points.length === 0) {
		points[0] = new L.LatLng(39.422039, -0.332980);
		points[1] = new L.LatLng(39.462671, -0.328131);
	}

	// set the view to the map, with the center within the calculated points
	var bounds = new L.LatLngBounds();
	for (i = 0; i < points.length; i++) {
		bounds.extend(points[i]);
	}
	map.setView(bounds.getCenter(), 12, true);

	// hack to paint correctly the map in jQueryMobile
	setTimeout(function() {
		map.invalidateSize();
		// when shown the view, set the bounds to the map to visualize better
		// the given points
		map.setZoom(map.getBoundsZoom(bounds));
	}, 1);
}

/**
 * Visualize all the Ships in the map
 */
function showShipsInMap(id) {
	var i, ship, points = [], popups = [];

	// remove markers
	removeMarkers();

	// calculate all the points
	for (i = 0; i < ships.length; i++) {
		ship = ships[i];
		if (!ship.latitude || !ship.longitude) {
			continue;
		}
		points[points.length] = new L.LatLng(ship.latitude, ship.longitude);
		popups[popups.length] = ship.name;
	}

	// add ship markers for every ship
	addMarkers(points, popups, getShipMarker());

	// set the view to the map
	setViewOfMap(points);
}

/**
 * Visualize all the Facilities in the map
 */
function showFacilitiesInMap(id) {
	var i, facility, points = [], popups = [];

	// remove markers
	removeMarkers();

	// calculate all the points
	for (i = 0; i < facilities.length; i++) {
		facility = facilities[i];
		if (!facility.latitude || !facility.longitude) {
			continue;
		}
		points[points.length] = new L.LatLng(facility.latitude,
				facility.longitude);
		popups[popups.length] = facility.name;
		if (i <= 8) {
			markers[markers.length] = getMarkers()[i + 1];
		} else {
			markers[markers.length] = getMarkers()[0];
		}
	}

	// add facility markers for every facility
	addMarkers(points, popups);

	// set the view to the map
	setViewOfMap(points);
}
